const gulp = require("gulp");

const cssmin = require("gulp-cssmin");

const autoPrefixer = require("gulp-autoprefixer");

const sass = require("gulp-sass");

const uglify = require("gulp-uglify");

const babel = require("gulp-babel");

const htmlmin = require("gulp-htmlmin");

const del = require("del");

const webserver = require('gulp-webserver')

const fileInclude = require('gulp-file-include')

const cssHandler = function () {
  return gulp
    .src("./src/css/*.css")
    .pipe(autoPrefixer())
    .pipe(cssmin())
    .pipe(gulp.dest("./dist/css/"));
};

const sassHandler = function () {
  return gulp
    .src("./src/sass/*.scss")
    .pipe(sass())
    .pipe(autoPrefixer())
    .pipe(cssmin())
    .pipe(gulp.dest("./dist/sass/"));
};

const jsHandler = function () {
  return gulp
    .src("./src/js/*.js")
    .pipe(
      babel({
        presets: ["@babel/env"],
      })
    )
    .pipe(uglify())
    .pipe(gulp.dest("./dist/js/"));
};

const htmlHandler = function () {
  return gulp
    .src("./src/pages/*.html")
    .pipe(fileInclude({
      prefix:'@-@',
      basepath:'./src/components'
    }))
    .pipe(
      htmlmin({
        collapseWhitespace: true,
        removeEmptyAttributes: true,
        collapseBooleanAttributes: true,
        removeAttributeQuotes: true,
        minifyCSS: true,
        minifyJS: true,
        removeStyleLinkTypeAttributes: true,
        removeScriptTypeAttributes: true,
      })
    )
    .pipe(gulp.dest("./dist/pages/"));
};

const imgHandler = function () {
  return gulp.src("./src/images/**").pipe(gulp.dest("./dist/images/"));
};

const videoHandler = function () {
  return gulp.src("./src/videos/**").pipe(gulp.dest("./dist/videos/"));
};

const audioHandler = function () {
  return gulp.src("./src/audios/**").pipe(gulp.dest("./dist/audios/"));
};

const libHandler = function () {
  return gulp.src("./src/lib/**/*").pipe(gulp.dest("./dist/lib/"));
};

const fontHandler = function () {
  return gulp.src("./src/fonts/**/*").pipe(gulp.dest("./dist/fonts/"));
};

const delHandler = function () {
  return del(["./dist/"]);
};

const watchHandler = function () {
    gulp.watch('./src/css/*.css', cssHandler)
    gulp.watch('./src/sass/*.scss',sassHandler)
    gulp.watch('./src/js/*.js',jsHandler)
    gulp.watch('./src/pages/*.html',htmlHandler)
    gulp.watch('./src/images/**',imgHandler)
    gulp.watch('./src/videos/**',videoHandler)
    gulp.watch('./src/lib/**/*',libHandler)
}

const webHandler = function () {
    return gulp
    .src('./dist')
    .pipe(webserver({
        root:'./dist',
        host: 'www.hjr.com',
        port: 3001,
        livereload:true,
        open:'./pages/index.html',//默认打开哪个文件(从dist目录)
        proxies:[//配置代理
            {
                source: '/dt',
                target: ''
            }
        ]

    }))
}

module.exports.cssHandler = cssHandler;

module.exports.sassHandler = sassHandler;

module.exports.jsHandler = jsHandler;

module.exports.htmlHandler = htmlHandler;

module.exports.imgHandler = imgHandler;

module.exports.videoHandler = videoHandler;

module.exports.audioHandler = autoPrefixer;

module.exports.libHandler = libHandler;

module.exports.fontHandler = fontHandler;

module.exports.delHandler = delHandler;

module.exports.default = gulp.series(
  delHandler,
  gulp.parallel(
    cssHandler,
    sassHandler,
    jsHandler,
    htmlHandler,
    imgHandler,
    videoHandler,
    fontHandler,
    libHandler,
    audioHandler
  ),
  webHandler,
  watchHandler
);
